<ix-users-search
  [dataProvider]="dataProvider()"
></ix-users-search>

@if (!isMobileView()) {
  <ng-container [ngTemplateOutlet]="thead"></ng-container>
}

<!-- TODO: Add global search parameters -->
<ix-table
  [ix-table-empty]="!(dataProvider().currentPageCount$ | async)"
  [emptyConfig]="emptyService.defaultEmptyConfig(dataProvider().emptyType$ | async)"
>
  @if (isMobileView()) {
    <ng-container [ngTemplateOutlet]="thead"></ng-container>
  }
  <tbody
    ix-table-body
    detailsRowIdentifier="uid"
    [columns]="columns"
    [dataProvider]="dataProvider()"
    [isLoading]="!!(dataProvider().isLoading$ | async)"
    (expanded)="expanded($event)"
  >
  </tbody>
</ix-table>

<ix-table-pager
  [dataProvider]="dataProvider()"
  [pageSize]="dataProvider().pagination.pageSize"
  [currentPage]="dataProvider().pagination.pageNumber"
></ix-table-pager>

<ng-template #thead>
  <div class="sticky-header">
    <thead
      class="user-header-row"
      ix-table-head
      [columns]="columns"
      [dataProvider]="dataProvider()"
    ></thead>
  </div>
</ng-template>
